<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>漫威</title>
    <!-- 引入bootstrap的css -->
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <!-- 引入自己的css样式文件 -->
    <link rel="stylesheet" href="./css/style.css">
</head>

<body>
    <!-- nav部分 -->





    <nav class="navbar navbar-default my-navbar" role="navigation">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
            <a class="navbar-brand visible-xs visible-sm" href="#">
                <!-- xs-logo 小屏logo -->
                <img src="./images/logo.jpg" alt="" class="xs-logo">
            </a>

        </div>
        <div class="container">
            <!-- Collect the nav links, forms, and other content for toggling -->

            <div class="collapse navbar-collapse navbar-ex1-collapse">
                <!-- lg-logo -->
                <a class="navbar-brand hidden-xs hidden-sm lg-logoimg" href="#">
                    <img src="./images/logo.jpg" alt="" class="lg-logo">
                </a>
                <ul class="nav navbar-nav">
                    <li class=""><a href="./character.html" target="blah">人物</a></li>
                    <li class=""><a href="comics.html">漫画</a></li>
                    <li class=""><a href="film.html">电影</a></li>
                    <li class=""><a href="#">电视节目</a></li>
                    <li class=""><a href="#">小游戏</a></li>
                    <li class=""><a href="#">新闻</a></li>
                    <li><a href="#">更多</a></li>
                </ul>
                <!-- <form class="navbar-form navbar-left" role="search">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Search">
                    </div>
                    <button type="submit" class="btn btn-default">Submit</button>
                </form> -->
                <ul class="nav navbar-nav navbar-right hidden-sm">

                    <li><a href="#"><span class="glyphicon glyphicon-shopping-cart"></span>商城</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span class="glyphicon glyphicon-user"></span>登录<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">注册</a></li>
                            <script>
                            </script>
                        </ul>
                    </li>

                    <li>
                        <input type="search" name="" id="input" class="navsearch" value="" required="required" title="" placeholder="搜索">
                    </li>
                    <li>
                        <p class="glyphicon glyphicon-search sous"></p>





                </ul>
            </div>
        </div>
        <!-- /.navbar-collapse -->
    </nav>
    <!-- 轮播图 -->
    <div id="carousel-id" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
            <li data-target="#carousel-id" data-slide-to="0" class=""></li>
            <li data-target="#carousel-id" data-slide-to="1" class="active"></li>
            <li data-target="#carousel-id" data-slide-to="2" class=""></li>
            <li data-target="#carousel-id" data-slide-to="3" class=""></li>
        </ol>
        <div class="carousel-inner">
            <div class="item">
                <img data-src="holder.js/900x500/auto/#777:#7a7a7a/text:First slide" alt="First slide" src="./images/01.jpg">
                <div class="container">

                </div>
            </div>
            <div class="item active">
                <img data-src="holder.js/900x500/auto/#666:#6a6a6a/text:Second slide" alt="Second slide" src="./images/02.jpg">
                <div class="container">

                </div>
            </div>
            <div class="item">
                <img data-src="holder.js/900x500/auto/#555:#5a5a5a/text:Third slide" alt="Third slide" src="./images/03.jpg">
                <div class="container">

                </div>
            </div>
            <div class="item">
                <img data-src="holder.js/900x500/auto/#555:#5a5a5a/text:Third slide" alt="Third slide" src="./images/04.jpg">
                <div class="container">

                </div>
            </div>

        </div>
        <a class="left carousel-control" href="#carousel-id" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
        <a class="right carousel-control" href="#carousel-id" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
    </div>
    <!-- 轮播图---end -->
    <!-- 最新电影 -->
    <div class="title no-padding">
        <h1>最新电影<span>News</span></h1>
    </div>
    <div class="news">

        <div class="container news-bg">

            <div class="news-bg2">
                <div class="col-md-5">
                    <img src="./images/10.jpg" alt="">
                </div>
                <div class="col-md-6">
                    <div class="cententer">
                        <h1>《复仇者联盟：终局之战》</h1>
                        <p>《复仇者联盟4：终局之战》是美国漫威影业公司出品的科幻电影，由安东尼·罗素和乔·罗素联合执导，小罗伯特·唐尼、克里斯·埃文斯、克里斯·海姆斯沃斯、马克·鲁法洛、斯嘉丽·约翰逊、杰瑞米·雷纳、保罗·路德、布丽·拉尔森、唐·钱德尔、凯伦·吉兰、乔什·布洛林等主演。 影片改编自美国漫威漫画，是漫威电影宇宙的第22部电影，讲述了在《复仇者联盟3：无限战争》的毁灭性事件过后，复仇者联盟在剩余盟友的帮助下再一次集结，逆转过去，重新创造希望的故事。 [1]
                        </p>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- 最新电影-end -->
    <!-- 电视节目 -->
    <div class="title">
        <h1>电视节目<span>TV</span></h1>
    </div>
    <div class="tv">

        <div class="container">

            <div class="row">
                <div class="col-md-5 col-sm-6 col-xs-6">
                    <div class="tv-img">
                        <img src="./images/07.jpg" alt="">
                    </div>

                </div>
                <div class="col-md-7 col-sm-6 col-xs-6">

                    <div class="row">
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>
                        <div class="tv-right">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <div class="rect">
                                    <p>神盾局第一季01集</p>
                                </div>
                            </div>
                        </div>

                    </div>
                    <p class="p1">《神盾局特工》（Marvel's Agents of S.H.I.E.L.D.，或简称：Agents of S.H.I.E.L.D.） [1]  是漫威电视制作的真人科幻动作剧集，是漫威电影宇宙的一部分，由《复仇者联盟》导演乔斯·韦登掌镜导航集，乔斯·韦登及其弟弟杰德·韦登、弟媳毛丽莎·谭查罗恩共同参与剧本创作。 [2]  剧集聚焦神秘组织神盾局，不过主角是人类特工，而不是钢铁侠、绿巨人等超级英雄们。</p>

                </div>
            </div>

        </div>

    </div>
    <!-- 电视节目-end -->


    <!-- 漫威游戏 -->
    <div class="title">
        <h1>漫威游戏<span>GAme</span></h1>
    </div>
    <div class="play">

        <div class="container">

            <div class="row">
                <div class="col-md-6 col-sm-6">
                    <div class="play-img"><img src="./images/06.jpg" alt=""></div>
                </div>



                <div class="col-md-6 col-sm-6">
                    <div class="play-content">
                        <p>集结地球上最强大的英雄，拥抱你的力量，实现你的超级英雄梦。</p>
                        <p>《漫威复仇者》是一款结合了原创电影化剧情及单人/多人合作玩法*的史诗级第三人称动作冒险游戏。在线组建至多四名成员的玩家团队，掌控非凡的能力，打造不断增长的英雄阵容，并与其他玩家合力捍卫地球，抵御加剧恶化的威胁。</p>

                        <a href="#">
                            <div class="purchase"><span>购买及体验</span></div>
                        </a>

                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- 漫威游戏-end -->
    <!-- 漫威新无限新论大图 -->
    <div class="wuxxl"></div>
    <!-- 漫威新无限新论大图-end -->
    <!-- 漫威动画区 -->
    <div class="container my-container">
        <div class="row manhua">

            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/地狱号(2020).jpg" alt="">
                </div>
                <p>地狱号(2020)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/复仇者联盟(2018).jpg" alt="">
                </div>
                <p>复仇者联盟(2018)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/剑之X手册(2020年).jpg" alt=" ">
                </div>
                <p>剑之X手册(2020年)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6 ">
                <div class="mahua-img ">
                    <img src="./images/漫威漫画/不朽绿巨人(2018).jpg" alt="">
                </div>
                <p>不朽绿巨人(2018)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/电缆(2020).jpg" alt="">
                </div>
                <p>电缆(2020)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/惊奇僵尸：复活(2020年).jpg" alt="">
                </div>
                <p>惊奇僵尸-复活(2020年)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/新突变体(2019年).jpg" alt="">
                </div>
                <p>新突变体(2019年)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/战锤40,000：马尔尼乌斯·卡尔加(2020年).jpg" alt="">
                </div>
                <p>马尔尼乌斯·卡尔加(2020年)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/漫威船长(2019年).jpg" alt="">
                </div>
                <p>漫威船长(2019年)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/美国船长(2018年).jpg" alt="">
                </div>
                <p>美国船长(2018年)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/神奇蜘蛛侠(2018).jpg" alt="">
                </div>
                <p>神奇蜘蛛侠(2018)</p>
            </div>
            <div class="col-md-2 col-sm-3 col-xs-6">
                <div class="mahua-img">
                    <img src="./images/漫威漫画/星球大战：达斯·维德(2020).jpg" alt="">
                </div>
                <p>星球大战：达斯·维德(2020))</p>
            </div>

        </div>
    </div>
    <!-- 漫威动画-end -->

    <!-- 页脚 -->
    <footer>
        <div class="container">

            <div class="row">
                <div class="col-md-2 col-md-offset-3 col-xs-3 col-sm-offset-1 col-xs-offset-1">
                    <h4>关于我们</h4>
                    <ul>

                        <li><a href="">平台服务协议</a></li>
                        <li>
                            <a href="">供应商计划</a>
                        </li>
                        <li>
                            <a href="">公司简介</a>
                        </li>
                        <li>
                            <a href="">工作机会</a>
                        </li>
                        <li>
                            <a href="">公司新闻</a>
                        </li>
                        <li>
                            <a href="">退款须知</a>
                        </li>
                        <li><a href="">iCookie 条款</a></li>
                        <li><a href="">隐私协议</a></li>
                        <li><a href="">客服中心</a></li>
                    </ul>
                </div>
                <div class="col-md-2 col-xs-3 col-sm-offset-1 ">
                    <h4>社区</h4>
                    <ul>







                        <li><a href="">论坛</a></li>
                        <li>
                            <a href="">博客</a>
                        </li>
                        <li>
                            <a href="">新闻中心</a>
                        </li>
                        <li>
                            <a href="">游戏中心</a>
                        </li>
                        <li>
                            <a href="">最佳游戏</a>
                        </li>
                        <li>
                            <a href="">加入我们</a>
                        </li>
                        <li><a href="">兑换礼品</a></li>

                    </ul>
                </div>
                <div class="col-md-3">
                    <h4>更多信息</h4>
                    <ul>




                        <li><a href="">开发商寻找发布资源</a></li>
                        <li><a href="">出版商寻求零售商合作</a></li>
                        <li><a href="">广告联盟 - 网站论坛 / 游戏博客</a></li>
                        <li><a href="">学生折扣</a></li>
                    </ul>
                </div>
            </div>
            <p>公司地址：武汉东湖新技术开发区光谷大道41号现代世贸中心2栋18楼</p>
            <p>©2019 所有商标版权属于其拥有者,中国大陆地区由武汉号号科技有限公司运营，版权所有 鄂ICP备19018440号-2</p>
        </div>
    </footer>
    <!-- 返回顶部 -->
    <div class="go-top">
        <p>Top</p>
    </div>

</body>
<!-- 引入jquery.js文件-->
<script src="./js/jquery.js"></script>
<!-- 引入bootstrap的js文件 -->
<script src="./js/bootstrap.min.js"></script>
<!-- 引入自己的js文件 -->
<script src="./js/my-js.js"></script>

</html>